@font-face {
    font-family: "iconfont"; /* project id 224028 */
    src: url("//at.alicdn.com/t/font_af7jufm3w1rwwmi.eot");
    src: url("//at.alicdn.com/t/font_af7jufm3w1rwwmi.eot?#iefix")
        format("embedded-opentype"),
      url("//at.alicdn.com/t/font_af7jufm3w1rwwmi.woff") format("woff"),
      url("//at.alicdn.com/t/font_af7jufm3w1rwwmi.ttf") format("truetype"),
      url("//at.alicdn.com/t/font_af7jufm3w1rwwmi.svg#iconfont") format("svg");
  }
  .avatar {
    display: inline-block;
    text-align: center;
    background: #ccc;
    color: #fff;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    vertical-align: middle;
    width: 32px;
    height: 32px;
    line-height: 32px;
    border-radius: 16px;
  }
  .avatar img {
    width: 100%;
    height: 100%;
  }
  .iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
  }
  
  .lock-screen-back {
    border-radius: 50%;
    z-index: -1;
    box-shadow: 0 0 0 0 #667aa6 inset;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all 3s;
  }
  .main {
    //position: absolute;
    width: 100%;
    height: 100%;
    .unlock-con {
      width: 0px;
      height: 0px;
      position: absolute;
      left: 50%;
      top: 50%;
      z-index: 11000;
    }
    .sidebar-menu-con {
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 21;
      transition: width 0.3s;
    }
    .layout-text {
      display: inline-block;
      white-space: nowrap;
      position: absolute;
    }
    .main-hide-text .layout-text {
      display: none;
    }
    &-content-container {
      position: relative;
    }
    &-header-con {
      box-sizing: border-box;
      position: fixed;
      display: block;
      padding-left: 200px;
      width: 100%;
      height: 100px;
      z-index: 20;
      box-shadow: 0 2px 1px 1px rgba(100, 100, 100, 0.1);
      transition: padding 0.3s;
    }
    &-breadcrumb {
      padding: 8px 15px 0;
    }
    &-menu-left {
      background: #464c5b;
      height: 100%;
    }
    .tags-con {
      height: 40px;
      z-index: -1;
      overflow: hidden;
      background: #f0f2f5;
      .tags-outer-scroll-con {
        position: relative;
        box-sizing: border-box;
        padding-right: 120px;
        width: 100%;
        height: 100%;
        .tags-inner-scroll-body {
          position: absolute;
          padding: 2px 24px;
          overflow: visible;
          white-space: nowrap;
          transition: left 0.3s ease;
        }
        .close-all-tag-con {
          position: absolute;
          right: 0;
          top: 0;
          box-sizing: border-box;
          padding-top: 8px;
          text-align: center;
          width: 110px;
          height: 100%;
          background: white;
          box-shadow: -3px 0 15px 3px rgba(0, 0, 0, 0.1);
          z-index: 10;
        }
      }
    }
    .sider-trigger-a {
      padding: 6px;
      width: 40px;
      height: 40px;
      display: inline-block;
      text-align: center;
      color: #5c6b77;
      margin: 3px 0px 0 12px;
    }
    .ivu-tag-blue .ivu-tag-dot-inner {
      background: #2d8cf0;
    }
    &-header {
      height: 60px;
      background: #fff;
      box-shadow: 0 2px 1px 1px rgba(100, 100, 100, 0.1);
      position: relative;
      z-index: 11;
      .navicon-con {
        margin: 6px;
        display: inline-block;
      }
      .header-middle-con {
        position: absolute;
        left: 60px;
        top: 0;
        right: 340px;
        bottom: 0;
        padding: 10px;
        overflow: hidden;
      }
      .header-avator-con {
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        width: 300px;
        .switch-theme-con {
          display: inline-block;
          width: 40px;
          height: 100%;
        }
        .message-con {
          display: inline-block;
          width: 30px;
          padding: 18px 0;
          text-align: center;
          cursor: pointer;
          i {
            vertical-align: middle;
          }
        }
        .change-skin {
          font-size: 14px;
          font-weight: 500;
          padding-right: 5px;
        }
        .switch-theme {
          height: 100%;
        }
        .user-dropdown {
          &-menu-con {
            position: absolute;
            right: 0;
            top: 0;
            width: 130px;
            height: 100%;
            .main-user-name {
              display: inline-block;
              width: 60px;
              word-break: keep-all;
              white-space: nowrap;
              vertical-align: middle;
              overflow: hidden;
              text-overflow: ellipsis;
              text-align: right;
            }
          }
          &-innercon {
            height: 100%;
            padding-right: 14px;
          }
        }
        .full-screen-btn-con {
          display: inline-block;
          width: 30px;
          padding: 18px 0;
          text-align: center;
          cursor: pointer;
          i {
            vertical-align: middle;
          }
        }
        .lock-screen-btn-con {
          display: inline-block;
          width: 30px;
          padding: 18px 0;
          text-align: center;
          cursor: pointer;
          i {
            vertical-align: middle;
          }
        }
      }
    }
    .single-page-con {
      position: absolute;
      top: 100px;
      right: 0;
      bottom: 0;
      overflow: auto;
      background-color: #f0f2f5;
      z-index: 1;
      transition: left 0.3s;
      display: flex;
      flex-direction: column;
      .single-page {
        margin: 15px;
        flex: auto;
      }
    }
    &-copy {
      text-align: center;
      padding: 10px 0 20px;
      color: #9ea7b4;
    }
  }
  .taglist-moving-animation-move {
    transition: transform 0.3s;
  }
  .logo-con {
    height: 64px;
    position: relative;
    line-height: 64px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    background: #002140;
    overflow: hidden;
    img {
      height: 64px;
      width: auto;
      display: inline-block;
      vertical-align: middle;
      padding: 16px 0px 16px 24px;
    }
    h1 {
      color: #fff;
      font-size: 20px;
      margin: 0 0 0 12px;
      font-family: "Myriad Pro", "Helvetica Neue", Arial, Helvetica, sans-serif;
      font-weight: 600;
      display: inline-block;
      vertical-align: middle;
    }
    i {
      height: 64px;
      width: auto;
      display: inline-block;
      vertical-align: middle;
      padding: 16px 0px 16px 24px;
    }
  }
  .page-body {
    margin: 8px;
  }
  
  .ivu-tag-blue {
    line-height: 32px !important;
  }
  
  //侧边栏颜色
.ivu-menu-dark {
  background: #001529 !important;
}
.ivu-menu-dark.ivu-menu-vertical .ivu-menu-opened .ivu-menu-submenu-title {
  background: #001529 !important;
}
.ivu-menu-dark.ivu-menu-vertical .ivu-menu-item:hover,
.ivu-menu-dark.ivu-menu-vertical .ivu-menu-submenu-title:hover {
  color: #fff;
  background: #001529 !important;
}

.ivu-menu-dark.ivu-menu-vertical .ivu-menu-item {
  background-color: transparent !important;
}
.ivu-menu-dark.ivu-menu-vertical .ivu-menu-opened {
  background: #000c17 !important;
}

//角色复选框
.check-role{
  margin: 8px 0 8px 0;
}